<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>task 9</title>
	<link rel="stylesheet" type="text/css" href="css/task9.css">
</head>
<body>
	<!-- 顶部 -->
	<header>
		<div class="content">
			<div class="icon fl"></div>
			<div class="search fr">
				<i></i>
				<input type="text" name="searchWord">
				<div class="login">
					<div class="icon"></div>
					登录
				</div>
			</div>
		</div>		
	</header>
	<!-- 正文 -->
	<div class="container">
		<!-- 左边栏 -->
		<div class="fl navLeft">
			<div class="information">
				<div class="infoPic"></div>
				<div class="infoName">ABC123</div>
				<div class="infoCol">
					<p>110</p>
					<p>收藏</p>
				</div>
				<div class="infoFan">
					<p>313</p>
					<p>粉丝</p>
				</div>
			</div>
			<!-- 列表导航 -->
			<ul class="firstClass">
				<li class="active">
					<i class="fcA"></i>
					<span>个人报表</span>
					<ul class="secondClass">
						<li>
							<i class="fsA"></i>
							<i class="fsA2"></i>
							<span>文件一</span>
						</li>
						<li class="active">
							<i class="fsB"></i>
							<i class="fsB2"></i>
							<span>文件二</span>
							<ul class="thirdClass">
								<li>
									<i class="ftA"></i>
									<span>文档1</span>
								</li>
								<li>
									<i class="ftB"></i>
									<span>文档1</span>
								</li>
							</ul>
						</li>
						<li>
							<i class="fsC"></i>
							<i class="fsC2"></i>
							<span>文件三</span>
						</li>
					</ul>	
				</li>
				<li>
					<i class="fcB"></i>
					<span>个人收藏</span>
				</li>
				<li>
					<i class="fcC"></i>
					<span>我的分享</span>
				</li>
				<li>
					<i class="fcD"></i>
					<span>图库</span>
				</li>
				<li>
					<i class="fcE"></i>
					<span>成长记录</span>
				</li>
				<li>
					<i class="fcF"></i>
					<span>账户信息</span>
				</li>
			</ul>
		</div>
		<!-- 右侧内容区 -->
		<div class="fr conRight">
			<div class="breadThumb">
				<ul>
					<li>C站</li>
					<li>&nbsp;&nbsp;/&nbsp;&nbsp;</li>
					<li>个人报表</li>
					<li>&nbsp;&nbsp;/&nbsp;&nbsp;</li>
					<li>文件一</li>
					<li>&nbsp;&nbsp;/&nbsp;&nbsp;</li>
					<li><a href="#">文档一</a></li>
				</ul>
			</div>
			<div class="subContainer">
				<!-- sub 1 -->
				<div class="subA">
					<ul class="lineA">
						<li class="itemA">						
							<span>查询项</span>
							<select>
								<option>第一项</option>
								<option>第一项</option>
							</select>
						</li>
						<li class="itemB">
							<span>买方</span>
							<select>
								<option>小A</option>
								<option>小A</option>
							</select>
						</li>
						<li class="itemC">
							<span>日期</span>
							<div>2016-04-01</div>
						</li>
						<li class="itemD">
							<span>总耗时</span>
							<select>
								<option>8天</option>
								<option>8天</option>
							</select>
						</li>
					</ul>
					<ul class="lineB">
						<li class="itemB">
							<span>卖方</span>
							<select>
								<option>小C</option>
								<option>小C</option>
							</select>
						</li>
						<li class="itemC">
							<span>人数</span>
							<select>
								<option>10人</option>
								<option>10人</option>
							</select>
						</li>
						<li class="itemD">
							<span>成交项</span>
							<select>
								<option>10项</option>
								<option>10项</option>
							</select>
						</li>
					</ul>
					<div class="exchange"></div>
					<div class="submitBtn">搜索</div>
				</div>
				<!-- sub 2 -->
				<ul class="subB">
					<li class="prev"></li>
					<li></li>
					<li></li>
					<li></li>
					<li></li>
					<li></li>
					<li></li>
					<li class="next"></li>
					<li class="history"></li>
				</ul>
			</div>
		</div>
	</div>
</body>
</html>